<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>Layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/lib/layui/css/layui.css"  media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>个人信息显示与修改</legend>
</fieldset>
<form class="layui-form" action="" >
    <div class="layui-form-item">
        <label class="layui-form-label">读者编号</label>
        <div class="layui-input-block">
            <input type="text" id="id" name="id" disabled="disabled" autocomplete="off" class="layui-input" th:value="${borrower.getId()}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">读者姓名</label>
        <div class="layui-input-block">
            <input type="text" name="name" disabled="disabled" autocomplete="off" class="layui-input" th:value="${borrower.getName()}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">注册日期</label>
        <div class="layui-input-block">
            <input type="text" name="date" disabled="disabled" autocomplete="off" class="layui-input" th:value="${borrower.getRegisterDate()}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">地址</label>
        <div class="layui-input-block">
            <input type="text" name="address" lay-verify="required" autocomplete="off" class="layui-input" th:value="${borrower.getAddress()}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">通信电话</label>
        <div class="layui-input-block">
            <input type="text" name="phone" autocomplete="off" lay-verify="phone|required" class="layui-input" th:value="${borrower.getPhoneNum()}">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="update1">修改</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>邮箱修改</legend>
</fieldset>
<form class="layui-form" action="" >
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-block">
            <input type="text" name="email" lay-verify="email|required" autocomplete="off" class="layui-input" th:value="${borrower.getEmail()}">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="update2">修改</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>密码修改</legend>
</fieldset>
<form class="layui-form" action="" >
    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
            <input type="password" name="password" lay-verify="password|required" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
            <input type="password" name="passwordConfirm" lay-verify="password|required" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="update3">修改</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

<script>
    layui.use(['form','layer'], function (){
        var form = layui.form, $ = layui.jquery,
            layer = layui.layer;
        var id = document.getElementById('id').value;
        form.on('submit(update1)', function (data) {
            layer.confirm('<div class="layui-inline">\n' +
                '      <label class="layui-form-label">验证密码</label>\n' +
                '      <div class="layui-input-inline">\n' +
                '        <input type="password" name="pwd" id="pwd" lay-verify="required" autocomplete="off" class="layui-input">\n' +
                '      </div>\n' +
                '    </div>', function (index) {
                data = data.field;
                data['pwd'] = document.getElementById('pwd').value;
                $.ajax({
                    url:"/adminUpdateBorrowerInfo",
                    type:"POST",
                    data:data,
                    success:function (result){
                        if (result.code==200){
                            layer.msg("修改成功",{
                                icon:6,
                                time:500
                            });
                        }else {layer.msg(result.msg);}
                    }
                });
            });
            return false;
        });
        form.on('submit(update2)', function (data) {
            layer.confirm('<div class="layui-inline">\n' +
                '      <label class="layui-form-label">验证密码</label>\n' +
                '      <div class="layui-input-inline">\n' +
                '        <input type="password" name="pwd" id="pwd" lay-verify="required" autocomplete="off" class="layui-input">\n' +
                '      </div>\n' +
                '    </div>', function (index) {
                data = data.field;
                data['id'] = id;
                data['pwd'] = document.getElementById('pwd').value;
                $.ajax({
                    url:"/adminUpdateBorrowerEmail",
                    type:"POST",
                    data:data,
                    success:function (result){
                        if (result.code==200){
                            layer.msg("修改成功",{
                                icon:6,
                                time:500
                            });
                        }else {layer.msg(result.msg);}
                    }
                });

            });
            return false;
        });
        form.on('submit(update3)', function (data) {
            layer.confirm('<div class="layui-inline">\n' +
                '      <label class="layui-form-label">验证密码</label>\n' +
                '      <div class="layui-input-inline">\n' +
                '        <input type="password" name="pwd" id="pwd" lay-verify="required" autocomplete="off" class="layui-input">\n' +
                '      </div>\n' +
                '    </div>', function (index) {
                data = data.field;
                data['id'] = id;
                data['pwd'] = document.getElementById('pwd').value;
                if (data.password != data.passwordConfirm){
                    layer.msg('两次密码不一致');
                    return false;
                }
                $.ajax({
                    url:"/adminUpdateBorrowerPassword",
                    type:"POST",
                    data:data,
                    success:function (result){
                        if (result.code==200){
                            layer.msg("修改成功",{
                                icon:6,
                                time:500
                            });
                        }else {layer.msg(result.msg);}
                    }
                });
            });
            return false;
        });
        form.verify({
            password:function (value, item){
                if(!/[0-9a-zA-Z]{6,9}/.test(value)){
                    return "密码格式错误";
                }
            },
        })
    })
</script>
</body>
</html>